import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:wechat_assets_picker/wechat_assets_picker.dart';
import '../common/constants.dart';
import '../controllers/report_controller.dart';

class ReportPage extends GetView<ReportController> {
  const ReportPage({super.key});

  _buildReasonTitle() {
    return Container(
      margin: EdgeInsets.fromLTRB(10, 0, 0, 5),
      child: Row(
        children: [
          Text(
            "举报原因",
            style: TextStyle(color: Colors.black, fontSize: 15),
          ),
          SizedBox(
            width: 2,
          ),
          Padding(
            padding: EdgeInsets.only(top: 8),
            child: Text(
              "*",
              style: TextStyle(color: Colors.red, fontSize: 18, fontWeight: FontWeight.bold),
            ),
          )
        ],
      ),
    );
  }

  _buildReportReasonGridView() {
    return GridView.builder(
      shrinkWrap: true,
      padding: EdgeInsets.symmetric(horizontal: 10),
      physics: NeverScrollableScrollPhysics(),
      gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(crossAxisCount: 3, crossAxisSpacing: 10, mainAxisSpacing: 10, childAspectRatio: (Get.width / 3) / 40),
      itemCount: controller.reasons.length,
      itemBuilder: (context, index) {
        return GestureDetector(
          onTap: () {
            controller.updateReasonIndex(index);
          },
          child: Container(
            decoration: BoxDecoration(
              color: controller.selectedReasonIndex == index ? Colors.black : Colors.grey[200],
              borderRadius: BorderRadius.circular(25),
            ),
            child: Center(
              child: Text(
                controller.reasons[index],
                style: TextStyle(color: controller.selectedReasonIndex == index ? Colors.white : Colors.black),
              ),
            ),
          ),
        );
      },
    );
  }

  _buildUploadImageTitle() {
    return Container(
      margin: EdgeInsets.fromLTRB(10, 20, 0, 5),
      child: Row(
        children: [
          Text(
            "上传图片（最多9张）",
            style: TextStyle(color: Colors.black, fontSize: 15),
          ),
          SizedBox(
            width: 2,
          ),
          Padding(
            padding: EdgeInsets.only(top: 8),
            child: Text(
              "*",
              style: TextStyle(color: Colors.red, fontSize: 18, fontWeight: FontWeight.bold),
            ),
          )
        ],
      ),
    );
  }

  _buildImageListGridView() {
    return GridView.builder(
      shrinkWrap: true,
      padding: EdgeInsets.symmetric(horizontal: 10),
      physics: NeverScrollableScrollPhysics(),
      gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
        crossAxisCount: 3,
        crossAxisSpacing: 15,
        mainAxisSpacing: 15,
      ),
      itemCount: controller.selectedImages.length,
      itemBuilder: (context, index) {
        if (controller.selectedImages[index].isAddBtn) {
          return GestureDetector(
            onTap: () {
              controller.pickerImages();
            },
            child: Container(
              decoration: BoxDecoration(
                borderRadius: BorderRadius.circular(10),
                border: Border.all(color: Colors.black12),
              ),
              child: Column(
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  Icon(
                    Icons.add,
                    color: Colors.black45,
                  ),
                  Text(
                    '添加图片',
                    style: TextStyle(color: Colors.black45),
                  )
                ],
              ),
            ),
          );
        } else {
          return Padding(
            padding: EdgeInsets.all(0),
            child: Stack(
              clipBehavior: Clip.none,
              children: [
                Positioned.fill(
                  child: ClipRRect(
                    borderRadius: BorderRadius.circular(10),
                    child: Image(
                      image: AssetEntityImageProvider(controller.selectedImages[index].asset!, isOriginal: false),
                      fit: BoxFit.cover,
                    ),
                  ),
                ),
                Positioned(
                  right: -20,
                  top: -22,
                  child: IconButton(
                    onPressed: () {
                      controller.removeImage(index);
                    },
                    icon: Container(
                      decoration: BoxDecoration(
                        color: Colors.black54,
                        borderRadius: BorderRadius.circular(20),
                      ),
                      child: Icon(Icons.close, color: Colors.white, size: 24),
                    ),
                  ),
                ),
              ],
            ),
          );
        }
      },
    );
  }

  _buildTextView() {
    return Container(
      margin: EdgeInsets.fromLTRB(10, 20, 10, 5),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text(
            "举报内容",
            style: TextStyle(color: Colors.black, fontSize: 15),
          ),
          SizedBox(
            height: 10,
          ),
          Container(
            width: double.infinity,
            height: 100,
            decoration: BoxDecoration(
              border: Border.all(color: Colors.black12, width: 1),
              borderRadius: BorderRadius.circular(10),
            ),
            child: TextField(
              keyboardType: TextInputType.multiline,
              maxLines: null,
              maxLength: 100,
              autofocus: false,
              decoration: InputDecoration(
                enabledBorder: UnderlineInputBorder(
                  borderSide: BorderSide.none,
                ),
                focusedBorder: UnderlineInputBorder(
                  borderSide: BorderSide.none,
                ),
                contentPadding: EdgeInsets.symmetric(horizontal: 10),
                counterStyle: TextStyle(color: Colors.black38),
                hintText: "请详细描述下你要举报的内容～",
                hintStyle: TextStyle(fontSize: 14, color: Colors.black38),
              ),
            ),
          ),
        ],
      ),
    );
  }

  _buildSubmitButton() {
    return Container(
      margin: EdgeInsets.symmetric(horizontal: 10, vertical: 10),
      width: double.infinity,
      child: FilledButton(
        onPressed: () {},
        style: FilledButton.styleFrom(backgroundColor: Constants.themeColor),
        child: Text(
          "提交",
          style: TextStyle(fontSize: 16),
        ),
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("举报"),
      ),
      body: GetBuilder<ReportController>(builder: (vc) {
        return SingleChildScrollView(
          child: Column(
            children: [_buildReasonTitle(), _buildReportReasonGridView(), _buildUploadImageTitle(), _buildImageListGridView(), _buildTextView(), _buildSubmitButton()],
          ),
        );
      }),
    );
  }
}
